<!DOCTYPE html>
<html class=reftest-wait>
<title>When paint containment is not present we should still run animation.</title>
<link rel="help" href="https://github.com/vmpstr/shared-element-transitions">
<link rel="author" href="mailto:vmpstr@chromium.org">

<script src="/common/rendering-utils.js"></script>
<script src="/common/reftest-wait.js"></script>

<style>
div {
  width: 10px;
  height: 10px;
  top: 10px;
  left: 10px;
  position: relative;
  background: blue;
}
.green { background: green; }
</style>

<div id=first></div>
<div id=second></div>

<script>
function rafAnimation() {
  first.classList.toggle("green");
  requestAnimationFrame(rafAnimation);
}

async function runTest() {
  await waitForAtLeastOneFrame();
  // Prepare with a shared element
  let promise = document.documentTransition.prepare({ sharedElements: [first] });
  // Force a hit test, which will determine compositing reasons.
  document.elementFromPoint(0, 0);
  // Now wait for the prepare to happen. This will note that we don't have
  // paint containment and should de-composite the element.
  await promise;
  document.documentTransition.start({ sharedElements: [second] });

  takeScreenshot();
}
  
onload = runTest;

// Continually run raf animation which should paint every frame.
rafAnimation();
</script>

</html>
